﻿<div class="row row-cols-4 g-2">
    <div class="col">
        <FileIcon class="custom-icon" Extension=".xlsx" IconColor="Color.Success" />
    </div>
    <div class="col">
        <FileIcon class="custom-icon" Extension=".docx" IconColor="Color.Primary" />
    </div>
    <div class="col">
        <FileIcon class="custom-icon" Extension=".pptx" IconColor="Color.Danger" />
    </div>
    <div class="col">
        <FileIcon class="custom-icon" Extension=".pdf" IconColor="Color.Warning" />
    </div>
    <div class="col">
        <FileIcon class="custom-icon" Extension=".mp4" IconColor="Color.Info">
            <BackgroundTemplate>
                <i class="fa-regular fa-clipboard fa-4x" />
            </BackgroundTemplate>
        </FileIcon>
    </div>
    <div class="col">
        <FileIcon class="custom-icon" Extension=".png" IconColor="Color.Secondary">
            <BackgroundTemplate>
                <i class="fa-regular fa-clipboard fa-4x" />
            </BackgroundTemplate>
        </FileIcon>
    </div>
    <div class="col">
        <FileIcon class="custom-icon" Extension=".jpeg" IconColor="Color.Dark">
            <BackgroundTemplate>
                <i class="fa-regular fa-clipboard fa-4x" />
            </BackgroundTemplate>
        </FileIcon>
    </div>
    <div class="col">
        <FileIcon class="custom-icon" Extension=".cs" IconColor="Color.Light">
            <BackgroundTemplate>
                <i class="fa-regular fa-clipboard fa-4x" />
            </BackgroundTemplate>
        </FileIcon>
    </div>
</div>
